﻿/*  Plusieurs présentations de listes word 
     http://html-color-codes.info/Codes-couleur-HTML/
 */
.word .icon {
    position: relative;
}

    .word .icon::before {
        content: "\f160";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: 700;
        text-decoration: inherit;
        /*--adjust as necessary--*/
        color: #000; /* #000*/
        font-size: 4vmin;/*
        padding: 0 1em 0 0.5em;*/
        color: white;
    }

.word dt {
    font-size: 2.8vmin;
    font-weight: 600;
    background-color: #C38011; /* marron  #87590C   */
    color: white;
    padding: 0.1em 0 012em 012em; /* hauteur centrage*/
    border: 1px solid white; /* espace entre */
    border-radius: 0.5em; /* arrondis*/
}

    .word dt:hover {
        cursor: url(hand.cur), pointer;
    }

.word dd {
    /* font-size: 1.6rem;*/
    /*enlève le retrait de 1ère ligne
    text-indent: 2em;*/
    font-weight: 600;
    margin: 1em 0 1em 3em; /*margin: 0 0 0 6em; */
    padding: 0 0 0.5em 0.2em; /*
    border-left: 2px solid #A17501;*/
    background-color: #F8F7F4; /* marron clair   */
}

    .word dd span.subtitre {
        margin: 0px 0 0 0;
        font-size: 2.2vmin;
        color: #9D3E0C;
        font-weight: 600;
        font-style: italic;
        display: block; /*saut de ligne*/
    }




/*word1*/

.word1 .icon {
    position: relative;
    color: #Ffffff;
}

    .word1 .icon::before {
        content: "\f160";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        text-decoration: inherit;
        /*--adjust as necessary--*/
        color: #Ffffff;
        font-size: 18px;
        padding-right: 0.5em;
    }

.word1 dt {
    font-size: 1.4rem;
    background-color: #87590C; /* marron  #87590C   */
    color: white;
    padding: 0.5em 0 0.5em 0.5em; /* hauteur centrage*/
    border: 2px solid white; /* espace entre */
    border-radius: 0.7em; /* arrondis*/
}

    .word1 dt:hover {
        cursor: url(hand.cur), pointer;
    }

.word1 dd {
    /* font-size: 1.6rem;*/
    /*enlève le retrait de 1ère ligne
    text-indent: 2em;*/
    margin: 0 0 1em 3em; /*margin: 0 0 0 6em; */
    padding: 0 0 0.5em 0.2em; /*
    border-left: 2px solid #A17501;*/
    background-color: #F8F7F4; /* marron clair   */
}
















/*  Plusieurs présentations de listes word liste1
     http://html-color-codes.info/Codes-couleur-HTML/
 */

.liste1 .icon {
    position: relative;
    color: #Ffffff;
}

    .liste1 .icon::before {
        content: "\f160";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        text-decoration: inherit;
        /*--adjust as necessary--*/
        color: #Ffffff;
        font-size: 18px;
        padding-right: 0.5em;
    }

.liste1 dt {
    font-size: 1.4rem;
    background-color: #87590C; /* marron  #87590C   */
    color: white;
    padding: 0.5em 0 0.5em 0.5em; /* hauteur centrage*/
    border: 2px solid white; /* espace entre */
    border-radius: 0.7em; /* arrondis*/
}

    .liste1 dt:hover {
        cursor: url(hand.cur), pointer;
    }

.liste1 dd {
    /* font-size: 1.6rem;*/
    /*enlève le retrait de 1ère ligne
    text-indent: 2em;*/
    margin: 0 0 1em 3em; /*margin: 0 0 0 6em; */
    padding: 0 0 0.5em 0.2em; /*
    border-left: 2px solid #A17501;*/
    background-color: #F8F7F4; /* marron clair   */
}


    .liste1 dd span.subtitre {
        margin: 10px 0 0 0;
        font-size: 1.6rem;
        color: maroon;
        font-weight: 700;
        font-style: italic;
        display: block; /*saut de ligne*/
    }

/*  liste2  genre texte avec soustitres  plusieurs présentations de listes word 
 */

.liste2 .icon {
    position: relative; /* 
    color: #Ffffff;*/
}

    .liste2 .icon::before {
        content: "\f160";
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        text-decoration: inherit;
        /*--adjust as necessary--
        color: #Ffffff;*/
        /*  font-size: 18px;*/
        padding-right: 0.5em;
    }

.liste2 dt {
    font-size: 1.5rem;
    font-weight: 700;
    /* background-color: #87590C;*/ /* marron  #87590C   */
    color: maroon;
    padding: 0.3em 0 0.2em 0.3em; /* hauteur centrage*/
    /* border: 2px solid white;  espace entre */
    /*border-radius: 0.7em;  arrondis*/
}

    .liste2 dt:hover {
        cursor: url(hand.cur), pointer;
    }

.liste2 dd {
    /* font-size: 1.6rem;*/
    /*enlève le retrait de 1ère ligne
    text-indent: 2em;*/
    margin: 0 0 1em 3em; /*margin: 0 0 0 6em; */
    padding: 0 0 0.5em 0.2em; /*
    border-left: 2px solid #A17501;*/
    background-color: #F8F7F4; /* marron clair   */
}

    .liste2 dd span.subtitre {
        margin: 0px 0 0 0;
        font-size: 1.2rem;
        color: #9D3E0C;
        font-weight: 600;
        font-style: italic;
        display: block; /*saut de ligne*/
    }



/* hauteur en toutes les li
li {
    margin-top: 0.5em;
}*/
